/**
 * 拖拽事件处理函数, 拓展jQuery方法
 * @method dragging
 * @author JunEnstein 2017-05-23
 */
$.fn.extend({
    drag: function(trigger){
    	/**
    	 * 当前元素的jQuery对象
    	 * @type {Object}
    	 */
		var $this = $(this);
    	if(trigger == undefined) trigger = this;
    	trigger = $(trigger);
		
		/**
		 * 外边距
		 * @type {Number}
		 */
		var paddingLeft = parseInt($this.css('padding-left')); 
		var paddingRight = parseInt($this.css('padding-right'));
		var paddingTop = parseInt($this.css('padding-top'));
		var paddingBottom = parseInt($this.css('padding-bottom'));
		
		/**
		 * 元素的实际宽度
		 * @type {Number}
		 */
		var realWidth = $this.width() + paddingLeft + paddingRight;
		
		/**
		 * 元素的实际高度
		 * @type {Number}
		 */
		var realHeight = $this.height() + paddingTop + paddingBottom;
		
		/**
		 * 最大移动范围(10 为误差修正)
		 * @type {Object}
		 */
		var max = {
			x : innerWidth - realWidth - 10,
			y : innerHeight - realHeight - 10,
		};

		/**
		 * 元素当前位置
		 * @type {Object}
		 */
		var position = {
			x: $this.position().left,
			y: $this.position().top
		};

		/**
		 * 开始位置,如果为null,说明尚未开始拖动
		 * @type {Object}
		 */
		var start = null;

		/**
		 * 设置元素位置
		 * @method setPosition
		 * @author JunEnstein 2017-05-23
		 * @param  {x:int, y:int} point 新得到的位置
		 */
		function setPosition(point){

			// 边界处理
			if(point.x < 0) point.x = 0;
			if(point.x > max.x) point.x = max.x;
			if(point.y < 0) point.y = 0;
			if(point.y > max.y) point.y = max.y;
			$this.css({"left": point.x, "top": point.y});
		}

		/**
		 * 使position与$this的位置保持同步
		 * @method syncPosition
		 * @author JunEnstein 2017-05-23
		 */
		function syncPosition(){
			position.x = $this.position().left;
			position.y = $this.position().top;
		}
		
		/**
		 * 监听当前元素的鼠标点击事件
		 * @method mousedown
		 * @author JunEnstein 2017-05-23
		 * @param  {MouseEvent} event 鼠标点击事件
		 */
		trigger.mousedown(function(event){
			event.preventDefault(); // 阻止默认事件
			start = {x: event.pageX, y: event.pageY};
			console.log(start);
			syncPosition();
		});

		/**
		 * 监听document的鼠标移动事件(为了防止鼠标移动出元素范围,故监听document元素)
		 * @method mousemove
		 * @author JunEnstein 2017-05-23
		 * @param  {MouseEvent} event 鼠标点击事件
		 */
		$(document).mousemove(function(event){
			if(start == null) return ;
			setPosition({
				x : position.x + event.pageX - start.x,
				y : position.y + event.pageY - start.y
			});

		});

		/**
		 * 监听document的鼠标释放事件(理由同mousemove)
		 * @method mouseup
		 * @author JunEnstein 2017-05-23
		 * @param  {MouseEvent} event 鼠标点击事件
		 */
		$(document).mouseup(function(event){
			start = null;
			syncPosition();
		});

		/**
		 * 窗口重绘事件(重新计算一些参数的值)
		 * @method resize
		 * @author JunEnstein 2017-05-23
		 * @param  {Object} event  窗口重绘事件
		 */
		$(window).resize(function(event){
			max = {
				x : innerWidth - realWidth - 10,
				y : innerHeight - realHeight - 10,
			};
			setPosition({
				x: $this.position().left,
				y: $this.position().top
			});
			syncPosition();
		});
    }
}); 